import React, { Component } from 'react'

export default class Tab extends Component {
    state = {
        count: 0
    }
    changeCount = (count) => {
        this.setState({
            count
        })
    }
    render() {
        const { count } = this.state
        const { list, type } = this.props
        console.log(type)
        return (
            <div className = { type }>
                <ul className="oul">
                    {
                        list.map((item, index) => {
                            return <li onClick = {() => {
                                this.changeCount(index)
                            }} className = { index === count? 'active': '' } key = { index }>
                                { item.title }
                            </li>
                        })
                    }
                </ul>
                <div className="context">
                    { list[count].contenxt }
                </div>
            </div>
        )
    }
}
